<template>
  <div>
    <div class="main">
      <van-field
        readonly
        class="input_text"
        name="Price"
        v-model="form.Price"
        label="使用金额"
        required
      >
      </van-field>

      <van-field
        readonly
        class="input_text"
        name="calendar"
        v-model="form.Year"
        label="年度"
        placeholder="请选择"
        required
      >
      </van-field>
      <van-field
        readonly
        class="input_text"
        name="form.PlanName"
        v-model="form.PlanName"
        label="费用计划"
        placeholder="请选择"
        v-if="form.PlanName"
      >
      </van-field>

      <van-field
      readonly
      class="input_text"
      name="form.Content"
        label="实际使用费用内容"
        v-model="form.Content"
        required
      >
      </van-field>

      <!-- <van-field label="证书附件" v-model="form.Attachs2" name="Attachs2">
      </van-field> -->
      <van-field label="发票或合同" class="input_text_block">
        <template #input>
          <div
            v-for="(item, index) in form.Attachs"
            :key="index"
            class="wrapper space-between mb-10"
          >
            <a style="color: blue" @click="goFile(item.AttCode)">
              {{ item.AttName }}{{ item.AttExt }}</a
            >
          </div>
        </template>
      </van-field>
    </div>
  </div>
</template>

<script>
import {
  initEntity,
  costPlanAddSubmit,
  GetDetail,
  CostPlanByYear,
} from "@/api/SiteSafeCost";
import { mapGetters } from "vuex";

export default {
  components: {},
  data() {
    return {
      id: this.$route.query.id,
      radio: "1",
      value: "",
      form: {},
      showPopup: false,
      filePopup: false,
    };
  },

  computed: {
    ...mapGetters(["baseUrl", "CompanyCode", "roles"]),
  },

  created() {
    if (this.$route.query.id != null) {
      (this.id = this.$route.query.id), this.getDetail();
    }
  },
  activated() {
    // if (this.$route.params.certFile) {
    // 	this.fileList.push({
    // 		AttCode: this.$route.params.certFile.AttCode,
    // 		AttExt: this.$route.params.certFile.AttExt,
    // 		AttName: this.$route.params.certFile.AttName,
    // 	})
    // }
    //将该页面的id和新获取的id进行比对，如果不一致，说明页面应该进行数据刷新
    //重新请求数据
    // if (this.$route.params.userlist) {
    //   const userlist = this.$route.params.userlist;
    //   let EquManagerChnName = [];
    //   let EquManagerUserName = [];
    //   userlist.forEach((item) => {
    //     EquManagerChnName.push(item.name);
    //     EquManagerUserName.push(item.code);
    //   });
    //   this.form.EquManagerChnName = EquManagerChnName.join(",");
    //   this.form.EquManagerUserName = EquManagerUserName.join(",");
    // }
  },
  methods: {
    getDetail(certId) {
      let params = { id: this.id };

      GetDetail(params).then((res) => {
        // res.data.PublishDate = getTime(res.data.PublishDate)
        // res.data.ReviewDate = getTime(res.data.ReviewDate)
        // res.data.NextReviewDate = getTime(res.data.NextReviewDate)

        if (res.data.Attachs) {
          let Attachs = res.data.Attachs.split(";");
          console.log(Attachs, "Attachs");
          res.data.Attachs = JSON.parse(res.data.Attachs);
        } else {
          res.data.Attachs = [];
        }
        this.form = res.data;
      });
    },

    // 附件详情

    goFile(attachCode) {
      this.$router.push("/Attach/AatachDetail?attCode=" + attachCode);
    },
  },
};
</script>

<style lang="less" >
.wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
}

.block {
  width: 120px;
  height: 120px;
  background-color: #fff;
}
</style>
<style lang="less" scoped>
.space-between {
  justify-content: space-between;
}
</style>
